<template>
  <div>
    <p class="ger">个人中心</p>
    <table style="margin-top: 50px">
      <tr class="dan">
        <a>员工编号</a>
        <a>{{userData.eid}}</a>
      </tr>
      <tr>
        <a>员工账号</a>
        <a>{{userData.ename}}</a>
      </tr>
      <tr class="dan">
        <a>真实姓名</a>
        <a>{{userData.realname}}</a>
      </tr>
      <tr>
        <a>员工性别</a>
        <a>{{userData.esex == 0?'男':'女'}}</a>
      </tr>
      <tr class="dan">
        <a>入职时间</a>
        <a>{{userEntryDate}}</a>
      </tr>
      <tr>
        <a>员工工资</a>
        <a>￥{{userData.sal}}元</a>
      </tr>
      <tr class="dan">
        <a>所属部门</a>
        <a>{{userData.dname}}</a>
      </tr>
    </table>
  </div>
</template>

<script>
export default {
  name: "ComponentsPersonal",
  data() {
    return {
      userData:{}
    };
  },
  mounted() {
    this.userInfo();
  },
  methods: {
    //获取用户信息
    async userInfo() {
      const result = await this.$API.reqUserInfo();
      if (result.status == 0) {
        this.userData = result.data
      }
    },
  },
  computed: {
    userEntryDate(){
      return (this.userData.entrydate || '').split('T')[0]
    }
  },
};
</script>

<style>
.ger {
  color: blue;
  font-size: 20px;
  height: 40px;
  position: absolute;
  top: 80px;
}
tr {
  height: 40px;
  line-height: 40px;
}
tr > a {
  width: 90px;
  float: left;
  margin-right: 150px;
  padding-left: 30px; 
  align-items: center;
}
.dan {
  background-color: azure;
}
</style>